<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script>
    // 目标：将一个对象的部分属性，赋值给另一个数组的每个对象
    // 初始化数据举例
    // 这个是我们将要使用的对象，需要使用这个对象的部分属性
    let oldObj={
        aa:1,
        ab:'haha',
        pa1:'pa1',
        pa2:'pa2',
        pa3:'pa3',
        pa4:'pa4',
        pa5:'pa5',
        pa6:'pa6',
    }
    // 这个是我们将要建立的数组的长度
     let arrLength=6;

    // 方法一 forEach
     let arr=[];
     Array.apply(null,{length:arrLength}).forEach((_,i) => {
         let item = oldObj['pa'+(i+1)];
         let object = {
             id: i+1,
             value: item?item:''
         }
         arr.push(object)
     });
     console.log('方法1');
     console.log(arr);

    //  方法二  map
    let arr1 = Array.apply(null, { length: arrLength}).map((_, i) => ({
        id: i + 1, value: oldObj['pa'+(i+1)] || ''
    }))
     console.log('方法2');
     console.log(arr1);

    //  方法三 reduce
   let obj = Array.apply(null, { length: arrLength}).reduce((acc, _, i) => ({
        ...acc, [i + 1]: oldObj[`pa${i+1}`] || ''}), {})
     console.log('方法3  reduce');
     console.log(obj);

    //  方法四 有问题，无法实现
    let arr3=new Array(arrLength).fill({});
    arr3.forEach((_,i)=>{
        let item = oldObj['pa'+(i+1)];
        _.id = (i+1);
        _.value = item ? item : '';
        console.log(_)
    })
     console.log('方法4');
     console.log(arr3);

    </script>
</body>
</html>